<%@ include file="/common/taglibs.jsp"%>

<head>
<title><fmt:message key="userProfile.title" /></title>
<script type="text/javascript">
	function showList(event) {

		if (event.value == 'Hospital') {
			$("#hospitalFS").show();
			$("#zoneFS").hide();
		}
		if (event.value == 'ZoneBirth' || event.value == 'ZoneDeath') {
			$("#hospitalFS").hide();
			$("#zoneFS").show();
		}
		if (event.value == 'Admin' || event.value == 'User') {
			$("#hospitalFS").hide();
			$("#zoneFS").hide();
		}

	}
</script>

<style type="text/css">
checkbox.small {
	display: inline-block;
	width: 75px;
	height: 28px;
	padding: 4px;
	margin-bottom: 9px;
	font-size: 13px;
	line-height: 18px;
	color: #555555;
	border: 1px solid #ccc;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

div.two_col_left_box {
	float: left;
	padding: 0px;
	width: 380px;
	border: 0px solid gray;
}

div.two_col_right_box {
	float: right;
	padding: 0px;
	width: 380px;
	border: 0px solid gray;
}

div.three_col_left_box {
	float: left;
	padding: 0px;
	width: 270px;
	border: 0px solid gray;
}

div.three_col_mid_box {
	float: left;
	padding: 0px;
	width: 270px;
	border: 0px solid gray;
}

div.three_col_mid_box_half {
	float: left;
	padding: 0px;
	margin-left: 10px;
	width: 80px;
	border: 0px solid gray;
}

div.three_col_right_box {
	float: left;
	padding: 0px;
	width: 220px;
	border: 0px solid gray;
}

div.form_row {
	width: 860px;
	padding: 1px;
	overflow: hidden;
	border: 0px solid gray;
	margin-top: 5px;
}

div.section_header {
	width: 840px;
	height: 26px;
	color: #FFFAFA;
	display: table-cell;
	vertical-align: middle;
	background-color: #545454;
	padding: 0 5px 2px;
	font-family: serif;
	font-size: 14px;
}
</style>

</head>

<body class="createHospital" />

<div class="span12">
	<s:form name="userForm" action="saveUser.action"
		enctype="multipart/form-data" method="post" validate="true"
		cssClass="well form-vertical">


		<s:hidden key="user.id" />
		<s:hidden key="user.version" />
		<input type="hidden" name="from" value="${param.from}" />


		<s:if test="user.version == null">
			<input type="hidden" name="encryptPass" value="true" />
		</s:if>

		<div class="section_header">
			<b>BASIC USER INFORMATION</b>
		</div>

		<div class="form_row">
			<div class="three_col_left_box">
			<s:textfield key="user.firstName" required="true" />
				
			</div>

			<div class="three_col_mid_box">
				<s:textfield key="user.lastName" required="true" />
			</div>

			<div class="three_col_right_box">
				
			</div>
		</div>

		<div class="form_row">
			<div class="three_col_left_box">
				<s:textfield key="user.email" required="true" />
			</div>

			<div class="three_col_mid_box">
				<s:textfield key="user.phoneNumber" required="true" />
			</div>

			<div class="three_col_right_box">
				<s:textfield key="user.website" />
			</div>
		</div>

		<div class="form_row">
			<div class="three_col_left_box">
				<s:textfield key="user.address" />
			</div>

			<div class="three_col_mid_box">
				<s:textfield key="user.postalCode" />
			</div>

			<div class="three_col_right_box">
				<%--  <s:set name="country" value="user.country" scope="page"/>
                <fieldset class="control-group">
                    <label for="user.country">
                        <fmt:message key="user.country"/>
                    </label>

                    <div class="controls">
                        <tb:country name="user.country" prompt="" default="${country}"/>
                    </div> 
                </fieldset> --%>
			</div>
		</div>

		<div class="section_header">
			<b>ADMIN SECTION</b>
		</div>

		<div class="form_row">
			<div class="three_col_left_box">
				<s:textfield key="user.username" required="true" />
			</div>
			<div class="three_col_mid_box">	
				<fieldset class="control-group">
					<label for="userType" class="control-label"><fmt:message
							key="user.usertype" /></label>
					<div class="controls">
						<select id="userType" name="user.userType"
							onchange="showList(this)">
							<s:iterator value="userTypeList" var="usrType">
								<option value="<s:property value="label"/>"
									${fn:contains(usrType.label, user.userType) ? 'selected' : ''}>
									<s:property value="value" />
								</option>
							</s:iterator>
						</select>
					</div>
				</fieldset>
			</div>

			<div class="three_col_right_box">
				<fieldset class="control-group hide" id="zoneFS">
					<label for="zones" class="control-label"><fmt:message
							key="user.zone" /></label>
					<div class="controls">
						<select id="zone" name="user.zones.id">
							<s:iterator value="zones" var="zoneVar">
								<option value="<s:property value="id"/>"
									${fn:contains(zoneVar.id, user.zoneId) ? 'selected' : ''}>
									<s:property value="name" />
								</option>
							</s:iterator>
						</select>
					</div>
				</fieldset>

				<fieldset class="control-group hide" id="hospitalFS">
					<label for="hospital" class="control-label"><fmt:message
							key="user.hospital" /></label>
					<div class="controls">
						<select id="hospital" name="user.hospital.id">
							<s:iterator value="hospitalsList" var="hosVar">
								<option value="<s:property value="id"/>"
									${fn:contains(hosVar.id, user.hospitalId) ? 'selected' : ''}>
									<s:property value="name" />
								</option>
							</s:iterator>
						</select>
					</div>
				</fieldset>
			</div>
		</div>

		<div class="form_row">
			<div class="three_col_left_box">
				<c:choose>
					<c:when test="${param.from == 'list'}">
						<fieldset class="control-group">
							<label class="control-label"><fmt:message
									key="userProfile.accountSettings" /></label>
							<div class="controls">
								<label class="checkbox inline"> <s:checkbox
										key="user.enabled" id="user.enabled" theme="simple"
										fieldValue="true" /> <fmt:message key="user.enabled" />
								</label> <label class="checkbox inline"> <s:checkbox
										key="user.accountExpired" id="user.accountExpired"
										theme="simple" fieldValue="true" /> <fmt:message
										key="user.accountExpired" />
								</label> <label class="checkbox inline"> <s:checkbox
										key="user.accountLocked" id="user.accountLocked"
										theme="simple" fieldValue="true" /> <fmt:message
										key="user.accountLocked" />
								</label> <br /> <label class="checkbox inline"> <s:checkbox
										key="user.credentialsExpired" id="user.credentialsExpired"
										theme="simple" fieldValue="true" /> <fmt:message
										key="user.credentialsExpired" />
								</label>
							</div>
						</fieldset>
						 <%-- <fieldset class="control-group">
							<label for="userRoles" class="control-label"><fmt:message
									key="userProfile.assignRoles" /></label>
							<div class="controls">
								<select id="roles" name="roles">
									<c:forEach items="${availableRoles}" var="role">
										<option value="${role.value}"
											${fn:contains(role.label, role.value) ? 'selected' : ''}>${role.label}</option>
									</c:forEach>
								</select>
							</div>
						</fieldset>  --%>
					</c:when>
					<c:otherwise>
						<fieldset class="control-group">
							<label class="control-label"><fmt:message
									key="user.roles" />:</label>
							<div class="controls readonly">
								<s:iterator value="user.roleList" status="status">
									<s:property value="label" />
									<s:if test="!#status.last">,</s:if>
									<input type="hidden" name="userRoles"
										value="<s:property value="value"/>" />
								</s:iterator>
							</div>
							<s:hidden name="user.enabled" value="%{user.enabled}" />
							<s:hidden name="user.accountExpired"
								value="%{user.accountExpired}" />
							<s:hidden name="user.accountLocked" value="%{user.accountLocked}" />
							<s:hidden name="user.credentialsExpired"
								value="%{user.credentialsExpired}" />
						</fieldset>
					</c:otherwise>
				</c:choose>
			</div>

			<div class="three_col_mid_box"></div>

			<div class="three_col_right_box"></div>
		</div>

		<fieldset class="form-actions">
			<s:submit key="button.save" method="save" cssClass="btn btn-primary"
				theme="simple" />

			<c:if test="${param.from == 'list' and not empty user.id}">
				<s:submit key="button.delete" method="delete"
					onclick="return confirmDelete('user')" cssClass="btn"
					theme="simple" />
			</c:if>

			<s:submit key="button.cancel" method="cancel" cssClass="btn"
				theme="simple" />
		</fieldset>
	</s:form>

</div>
<c:set var="scripts" scope="request">
	<script type="text/javascript">
	    function passwordChanged(passwordField) {
	        if (passwordField.name == "user.password") {
	            var origPassword = "<s:property value="user.password"/>";
	        } else if (passwordField.name == "user.confirmPassword") {
	            var origPassword = "<s:property value="user.confirmPassword"/>";
	        }
	
	        if (passwordField.value != origPassword) {
	            createFormElement("input", "hidden", "encryptPass", "encryptPass",
	                    "true", passwordField.form);
	        }
	    }
	    $(document).ready(function(){
	    	if($("#userType").val()== 'ZoneBirth' || $("#userType").val()== 'ZoneDeath'){
	    		$("#zoneFS").show();
	    	}
	    	if($("#userType").val()== 'Hospital'){
	    		$("#hospitalFS").show();
	    	}
	    	});
	</script>
</c:set>
